<template>
  <div v-if="model">
    <div v-if="model.consignee">
      <el-divider content-position="left">验收信息</el-divider>
      <el-form-item v-if="model.consignee.type==1" label="验收类型">
        <el-tag type="danger" effect="dark">部分退货</el-tag>
      </el-form-item>
      <el-form-item label="回执单：">
        <el-image
          fit="contain"
          :src="model.consignee.receipt"
          :preview-src-list="[model.consignee.receipt]"
        />
      </el-form-item>
      <el-row class="row-bg">
        <el-col :span="8">
          <el-form-item label="打包数：">
            <label><span class="money">{{ orderInfo.packages }}</span> 包</label>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="供货重量：">
            <label><span class="money">{{ orderInfo.quantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="扣点：">
            <label><span class="money">{{ orderInfo.deduct.toFixed(3) }}</span> %</label>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="扣点重量：">
            <label><span class="money">{{ orderInfo.deductQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="结算量：">
            <label><span class="money">{{ orderInfo.settleQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>

      </el-row>
      <!-- <el-row v-if="model.consignee.deductQuantity>0" class="row-bg">
        <el-col :span="6">
          <el-form-item label="扣点：">
            <label><span class="money">{{ model.consignee.deductQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>
        <el-col v-if="model.consignee.waterQuantity>0" :span="6">
          <el-form-item label="水份：">
            <label><span class="money">{{ model.consignee.waterQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>
        <el-col v-if="model.consignee.impurityQuantity>0" :span="6">
          <el-form-item label="杂质：">
            <label><span class="money">{{ model.consignee.impurityQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>
        <el-col v-if="model.consignee.discardQuantity && model.consignee.discardQuantity>0" :span="6">
          <el-form-item label="杂纸：">
            <label><span class="money">{{ model.consignee.discardQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>

        <el-col v-if="model.consignee.otherQuantity>0" :span="6">
          <el-form-item label="其他：">
            <label><span class="money">{{ model.consignee.otherQuantity.toFixed(3) }}</span> 吨</label>
          </el-form-item>
        </el-col>
      </el-row> -->
      <el-form-item label="凭证：">
        <el-image v-for="(item,index) in model.consignee.certificates" :key="index" fit="contain" :src="item" :preview-src-list="model.consignee.certificates" />
      </el-form-item>
    </div>
    <div v-if="model.partReturn">
      <el-divider content-position="left">部分收货</el-divider>
      <el-form-item label="回执单：">
        <el-image
          fit="contain"
          :src="model.partReturn.receipt"
          :preview-src-list="[model.partReturn.receipt]"
        />
      </el-form-item>
      <el-form-item label="凭证：">
        <el-image v-for="(item,index) in model.partReturn.certificates" :key="index" fit="contain" :src="item" :preview-src-list="model.partReturn.certificates" />
      </el-form-item>
      <el-form-item label="描述：">
        <label>{{ model.partReturn.message }}</label>
      </el-form-item>
    </div>
    <div v-if="model.pricing">
      <el-divider content-position="left">定价信息</el-divider>
      <el-row class="row-bg">
        <el-col :span="6">
          <el-form-item label="定价：">
            <label v-if="model.pricing.paymentAmount>0" class="money">￥{{ model.pricing.paymentAmount.toFixed(2) }}</label>
            <label v-else class="money">￥{{ model.pricing.profit.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="结算价格：">
            <label class="money">￥{{ model.pricing.actualAmount.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row class="row-bg">
        <el-col v-if="model.pricing.freight" :span="6">
          <el-form-item label="运费：">
            <label class="money">-￥{{ model.pricing.freight.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
        <el-col v-if="model.pricing.penalty" :span="6">
          <el-form-item label="罚款：">
            <label class="money">-￥{{ model.pricing.penalty.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
        <el-col v-if="model.pricing.expense" :span="6">
          <el-form-item label="业务费：">
            <label class="money">-￥{{ model.pricing.expense.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
        <el-col v-if="model.pricing.other" :span="6">
          <el-form-item label="其他：">
            <label class="money">-￥{{ model.pricing.other.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="描述：">
        <label>{{ model.pricing.message }}</label>
      </el-form-item>
    </div>
    <div v-if="model.adjust">
      <el-divider content-position="left">核算信息</el-divider>
      <el-row class="row-bg">
        <el-col :span="6">
          <el-form-item label="核算：">
            <label class="money">￥{{ model.adjust.actualAmount.toFixed(2) }}</label>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="描述：">
        <label>{{ model.adjust.message }}</label>
      </el-form-item>
    </div>
    <div v-if="model.reply">
      <el-divider content-position="left">核算审批信息</el-divider>
      <el-row class="row-bg">
        <el-col :span="6">
          <el-form-item label="核算：">
            <label class="money">￥{{ model.reply.actualAmount.toFixed(2) }}</label>
            <el-tag v-if="orderInfo.flag>2" size="mini" effect="plain" type="danger">{{ $constants.supOrderFlag.get(orderInfo.flag).label }}</el-tag>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="描述：">
        <label>{{ model.reply.message }}</label>
      </el-form-item>
    </div>
    <div v-if="model.payment">
      <el-divider content-position="left">结算信息</el-divider>
      <el-row v-if="model.payment.bank" class="row-bg">
        <el-col :span="6">
          <el-form-item label="结算方式：">
            <label>{{ model.payment.bank.bankName }}</label>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="开户行：">
            <label>{{ model.payment.bank.openingBank }}</label>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="姓名：">
            <label>{{ model.payment.bank.accountName }}</label>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="卡号：">
            <label>{{ model.payment.bank.cardNumber }}</label>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="核算金额：">
        <label v-if="model.payment.actualAmount"><span class="money">￥{{ model.payment.actualAmount.toFixed(2) }}</span></label>
        <label v-else><span class="money">￥{{ model.adjust.actualAmount.toFixed(2) }}</span></label>
      </el-form-item>
      <el-form-item v-if="model.payment.paymentAmount" label="付款金额：">
        <label class="money">￥{{ model.payment.paymentAmount.toFixed(2) }}</label>
      </el-form-item>
      <el-form-item label="凭证：">
        <el-image
          fit="contain"
          :src="model.payment.certificate"
          :preview-src-list="[model.payment.certificate]"
        />
      </el-form-item>
      <el-form-item label="描述：">
        <label>{{ model.payment.message }}</label>
      </el-form-item>
    </div>

  </div>
</template>
<script>
export default {
  name: 'PurExtend',
  data() {
    return {
      model: {
        consignee: null,
        partReturn: null,
        pricing: null,
        adjust: null,
        reply: null
      },
      orderInfo: null
    }
  },
  mounted() {
  },
  methods: {
    load(logs, orderInfo) {
      const that = this
      that.orderInfo = orderInfo
      // 验收信息
      const consignees = logs.filter(o => o.action === 2)
      if (consignees.length > 0) {
        const log = consignees[consignees.length - 1]
        that.model.consignee = JSON.parse(log.extendJson)
        that.model.consignee.message = log.message
      }
      // 部分退货
      const partReturns = logs.filter(o => o.action === 8)
      if (partReturns.length > 0) {
        const log = partReturns[partReturns.length - 1]
        that.model.partReturn = JSON.parse(log.extendJson)
        that.model.partReturn.label = '部分退货'
        that.model.partReturn.message = log.message
      }

      // 结算信息
      const payments = logs.filter(o => o.action === 5)
      if (payments.length > 0) {
        const log = payments[payments.length - 1]
        that.model.payment = JSON.parse(log.extendJson)
        that.model.payment.message = log.message
      }
      // 定价信息
      const pricings = logs.filter(o => o.action === 3)
      if (pricings.length > 0) {
        const log = pricings[pricings.length - 1]
        that.model.pricing = JSON.parse(log.extendJson)
        that.model.pricing.message = log.message
      }
      // 核算信息
      const adjusts = logs.filter(o => o.action === 4)

      if (adjusts.length > 0) {
        const log = adjusts[adjusts.length - 1]
        that.model.adjust = JSON.parse(log.extendJson)
        that.model.adjust.message = log.message
      }

      // 神算审核信息
      const replys = logs.filter(o => o.action === 11)

      if (replys.length > 0) {
        const log = replys[replys.length - 1]
        that.model.reply = JSON.parse(log.extendJson)
        that.model.reply.message = log.message
      }
    },
    show(item) {
      const h = this.$createElement

      this.$msgbox({
        title: '预览图片',
        message: h('div', null, [
          h('img', { style: 'height:500px', domProps: { src: item }}, 'VNode')
        ])
      })
    }
  }
}
</script>
